<template>
    <soHeader/>
    <div class="test">
        <soNav/>
        <div class="workspace">
            <RouterView/>
            <!-- 这里是路由视图 -->
        </div>
    </div>
</template>
<script setup>
    import soHeader from './soHeader.vue';
    // 引入soHeader组件
    import soNav from './soNav.vue';
    // 引入soNav组件
    import { RouterView } from 'vue-router';
</script>
<style scoped>
    .test {
        display: flex;
        width: 100%;
        min-height: calc(100vh - 60px);
        /* height: 100vh; */
        background-color: #f0f0f0;
        margin-top: 60px; /* 留出页眉的高度 */
    }
    .workspace {
        flex: 1; /* 占据剩余空间 */
        padding: 20px;
        background-color: #fff;
        height: calc(100vh - 60px); /* 留出页眉的高度 */
        overflow-y: auto; 
    }
</style>